<template>
    <div>
        <el-popover v-if="picPath" trigger="hover" :placement="placement" style="width:150px;height:150px;">
            <img class="table-img-bg" :src="picPath" />
            <div slot="reference">
                <img class="table-img" :src="picPath" />
            </div>
        </el-popover>
        <span v-else>-</span>
    </div>
</template>
<script>
export default {
    props: {
        // 图片地址
        picPath: {
            type: String,
            default: ''
        },
        // hover的方向
        placement: {
            type: String,
            default: 'top'
        }
    },
    data() {
        return {}
    }
}
</script>
<style lang="scss" scoped>
.table-img {
    width: 50px;
    height: 50px;
    margin: 0 auto;
}
.table-img-bg {
    width: 150px;
    height: 150px;
}
</style>
